.flex {
    display: flex;
    align-items: center;
}
.container {
    background-color: #f5f5f5;
    .toward {
        height: 750rpx;
        width: 100%;
        position: fixed;
        .map {
            width: 100%;
            height: 100%;
        }
    }
    .content {
        padding: 24rpx 24rpx calc(env(safe-area-inset-bottom) + 100rpx) 24rpx;
        box-sizing: border-box;
        position: relative;
        z-index: 999;
        overflow-y: auto;
        .card {
            background: #ffffff;
            border-radius: 8rpx;
            padding: 24rpx;
            box-sizing: border-box;
            margin-bottom: 20rpx;
            .card-status-title {
                font-size: 28rpx;
                font-family: PingFang SC-Semibold, PingFang SC;
                font-weight: bold;
                color: #222222;
                line-height: 33rpx;
                border-bottom: 1rpx solid #F5F5F5;
                padding: 15rpx 0;
                box-sizing: border-box;
              }
              .card-status-subtitle{
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #939395;
                line-height: 33rpx;
                padding: 15rpx 0;
                box-sizing: border-box;
              }
              .err-title{
                color: #FE4500;
              }
            .card-status {
                padding-bottom: 24rpx;
                .status {
                    font-size: 32rpx;
                    font-family: PingFang SC-Semibold, PingFang SC;
                    font-weight: 600;
                    color: #222222;
                    line-height: 38rpx;
                }
                .status-red {
                    color: #ff2d52;
                }
                .status-tips {
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #222222;
                    line-height: 40rpx;
                    margin-top: 8rpx;
                    text {
                        color: #ff2d52;
                        padding: 0 8rpx;
                    }
                }
            }
            .courier {
                padding-bottom: 12rpx;
                .courier-img {
                    width: 40rpx;
                    height: 40rpx;
                    margin-right: 8rpx;
                }
                .courier-name {
                    font-size: 28rpx;
                    font-family: PingFang SC-Semibold, PingFang SC;
                    font-weight: 600;
                    color: #222222;
                    line-height: 33rpx;
                    margin-right: 32rpx;
                }
                .courier-code {
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #222222;
                    line-height: 33rpx;
                    margin-right: 8rpx;
                }
                .courier-copy {
                    width: 32rpx;
                    height: 32rpx;
                }
            }
            .card-address {
                > view:first-child {
                    justify-content: space-between;
                    view:first-child {
                        font-size: 28rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #939395;
                        line-height: 33rpx;
                        text {
                            font-weight: 600;
                            color: #222222;
                            margin-right: 10rpx;
                        }
                        image {
                            width: 36rpx;
                            height: 36rpx;
                            margin-right: 10rpx;
                        }
                    }
                    view:last-child {
                        padding: 10rpx 28rpx;
                        line-height: 28rpx;
                        text-align: center;
                        border-radius: 42rpx;
                        border: 1rpx solid #bfbfbf;
                        font-size: 28rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #222222;
                    }
                }
                > .tips {
                    margin-top: 8rpx;
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #636569;
                    line-height: 33rpx;
                }
                .tips-ths {
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #636569;
                    margin-top: 12rpx;
                    line-height: 33rpx;
                }
                .date {
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #939395;
                    line-height: 33rpx;
                    margin-top: 8rpx;
                }
            }
            .card-shop-title {
                justify-content: space-between;
                padding-bottom: 24rpx;
                > text {
                    font-size: 28rpx;
                    font-family: PingFang SC-Semibold, PingFang SC;
                    font-weight: 600;
                    color: #222222;
                    line-height: 40rpx;
                }
                view {
                    image {
                        width: 40rpx;
                        height: 40rpx;
                    }
                    text {
                        margin-left: 4rpx;
                        line-height: 40rpx;
                        font-size: 28rpx;
                        font-family: PingFang SC-Semibold, PingFang SC;
                        font-weight: 600;
                        color: #967e4f;
                    }
                }
            }
            .card-shop-content {
                align-items: flex-start;
                padding-top: 24rpx;
                > image {
                    width: 112rpx;
                    height: 112rpx;
                    border-radius: 4rpx;
                    margin-right: 24rpx;
                }
                .card-content-right {
                    flex: 1;
                    > .flex {
                        justify-content: space-between;
                        .flex {
                            text {
                                font-size: 32rpx;
                                font-family: PingFang SC-Semibold, PingFang SC;
                                font-weight: 600;
                                color: #222222;
                                line-height: 40rpx;
                                margin-right: 12rpx;
                            }
                            view {
                                background: #f4f2ed;
                                height: 30rpx;
                                line-height: 30rpx;
                                padding: 0 8rpx;
                                font-size: 22rpx;
                                font-family: PingFang SC-Semibold, PingFang SC;
                                font-weight: 600;
                                color: #967e4f;
                            }
                        }
                        > view:last-child {
                            font-size: 32rpx;
                            font-family: PingFang SC-Semibold, PingFang SC;
                            font-weight: 600;
                            color: #222222;
                            line-height: 40rpx;
                        }
                    }
                    .card-content-right-text {
                        font-size: 24rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #636569;
                        line-height: 36rpx;
                        margin-top: 4rpx;
                    }
                }
            }
            .pay-info {
                .flex {
                    justify-content: space-between;
                    padding-top: 20rpx;
                    .black-font{
                        color: black !important;
                    }
                    text:first-child {
                        font-size: 28rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #636569;
                        line-height: 40rpx;
                    }
                    text:last-child {
                        line-height: 40rpx;
                        font-size: 28rpx;
                        font-family: PingFang SC-Semibold, PingFang SC;
                        font-weight: 600;
                        color: #ff2d52;
                    }
                    
                }
                .flex:first-child {
                    padding-bottom: 24rpx;
                    padding-top: 0;
                    text {
                        font-size: 28rpx;
                        font-family: PingFang SC-Semibold, PingFang SC;
                        font-weight: 600;
                        color: #222222;
                        line-height: 40rpx;
                    }
                    text:last-child {
                        font-size: 32rpx;
                    }
                }
            }
            .card-order {
                .flex {
                    justify-content: space-between;
                    padding: 20rpx 0;
                    > text {
                        font-size: 28rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #636569;
                        line-height: 40rpx;
                    }
                    > view {
                        text {
                            font-size: 28rpx;
                            font-family: PingFang SC-Regular, PingFang SC;
                            font-weight: 400;
                            color: #636569;
                            line-height: 40rpx;
                        }
                        image {
                            width: 32rpx;
                            height: 32rpx;
                            margin-left: 12rpx;
                        }
                    }
                }
                .flex:first-child {
                    padding-top: 0;
                }
                .flex:last-child {
                    padding-bottom: 0;
                }
            }
        }
    }
    .bottom {
        position: fixed;
        width: 100%;
        bottom: 0;
        z-index: 1001;
        box-sizing: border-box;
        background-color: #fff;
        padding: 16rpx 32rpx;
        // padding-bottom: constant(safe-area-inset-bottom);
        // padding-bottom: env(safe-area-inset-bottom);
        .payment {
            width: 100%;
            height: 80rpx;
            background: #ff2d52;
            border-radius: 4rpx;
            text-align: center;
            line-height: 80rpx;
            font-size: 28rpx;
            font-family: PingFang SC-Regular, PingFang SC;
            font-weight: 400;
            color: #ffffff;
        }
        .btns {
            justify-content: center;
            gap: 24rpx;
            view {
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #636569;
                line-height: 36rpx;
                padding: 10rpx 24rpx;
                border-radius: 42rpx;
                border: 1rpx solid #bfbfbf;
            }
            .confirm {
                background: #ff2d52;
                border: 1rpx solid #ff2d52;
                color: #ffffff;
            }
        }
    }
}
.dialog-content {
    text-align: center;
    image {
        width: 176rpx;
        height: 176rpx;
        border-radius: 4rpx;
        margin: 32rpx auto 56rpx;
    }
    .tips {
        font-size: 30rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        color: #222222;
        line-height: 40rpx;
        text-align: center;
        margin-bottom: 36rpx;
        padding: 0 32rpx;
    }
    .btn {
        width: 300rpx;
        text-align: center;
        margin: 0 auto 20rpx auto;
        height: 80rpx;
        background: #222222;
        border-radius: 8rpx;
        font-size: 28rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        color: #ffffff;
        line-height: 80rpx;
    }
}
.logistics-content {
    .courier {
        padding: 20rpx 32rpx;
        .courier-img {
            width: 40rpx;
            height: 40rpx;
            margin-right: 8rpx;
        }
        .courier-name {
            font-size: 28rpx;
            font-family: PingFang SC-Semibold, PingFang SC;
            font-weight: 600;
            color: #222222;
            line-height: 33rpx;
            margin-right: 32rpx;
        }
        .courier-code {
            font-size: 28rpx;
            font-family: PingFang SC-Regular, PingFang SC;
            font-weight: 400;
            color: #222222;
            line-height: 33rpx;
            margin-right: 8rpx;
        }
        .courier-copy {
            width: 32rpx;
            height: 32rpx;
        }
    }
    .logistics-details{
        max-height: 600rpx;
        overflow: scroll;
        .details-item{
            height: 184rpx;
            display: flex;
            align-items: flex-end;
            .item-left{
                width: 42rpx;
                height: 184rpx;
                // background-color: rebeccapurple;
                border-right: 1rpx solid #BFBFBF;
            }
            .item-right{
                flex:1;
                height: 184rpx;
                position: relative;
                padding-left: 26rpx;
                .right-circle{
                    width: 20rpx;
                    height: 20rpx;
                    background: #BFBFBF;
                    border-radius: 10rpx;
                    position: absolute;
                    top: 34rpx;
                    left: -10rpx
                }
                view:nth-of-type(2){
                    font-weight: 600;
                    font-size: 32rpx;
                    color: #222222;
                    margin-top: 20rpx;
                }
                view:nth-of-type(3){
                    width: 620rpx;
                    line-height: 30rpx;
                    font-weight: 400;
                    font-size: 28rpx;
                    color: #939395;
                    margin-top: 14rpx;
                    display: -webkit-box;
                    text-overflow: ellipsis;
                    -webkit-line-clamp: 2; /* 2指超过两行就显示省略号，以此类推 */
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                }
                view:nth-of-type(4){
                    font-weight: 400;
                    font-size: 28rpx;
                    color: #939395;
                    margin-top: 6rpx;
                }
            }
        }
        .details-item:nth-of-type(1){
            .item-left{
                height: 140rpx;
            }
            .item-right{
                .right-circle{
                    background-color: #FF2D52;
                }
            }
        }
    }
    .con-address{
        height: 180rpx;
        view:nth-of-type(1){
            display: flex;
            align-items: center;
            padding: 24rpx 0 0 24rpx;
            image{
                width: 40rpx;
                height: 40rpx;
                margin-right: 24rpx;
            }
            text:nth-of-type(1){
                font-weight: 600;
                font-size: 32rpx;
                color: #222222;
            }
            text:nth-of-type(2){
                font-weight: 400;
                font-size: 28rpx;
                color: #939395;
                margin-left: 12rpx;
            }
        }
        view:nth-of-type(2){
            width: 600rpx;
            font-weight: 400;
            font-size: 28rpx;
            color: #636569;
            margin-left: 90rpx;
        }
    }
}
